<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动场景1：图片与文字环绕</title>
		
	</head>
	<style>
		img{
			/* 图片脱离文档流--文字包含在图片周边 */
			float: left;
			margin-right: 50px;/*图片与文字链接处间隙*/
			margin-bottom: 50px;/*图片与文字连接处间隙*/
		}
		p{
			font-size: 16px; /*页面默认字体尺寸*/
			line-height: 20px; /*浮动文字，行高无法设定*/
			word-spacing: 20px;
			
		}
	</style>
	<body>
		<h1>浮动之图片文字环绕</h1>
		<img src="img/哪吒2系列敖闰_爱给网_aigei_com.png" alt="姑姑" width="200px" height="300px" />
		<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Fugiat cupiditate laboriosam, assumenda quas harum odit beatae debitis, numquam doloribus error adipisci doloremque maiores laborum voluptatibus hic corrupti. Nemo, maxime laudantium. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Aspernatur, sapiente! Fugiat nisi cupiditate, quaerat consectetur eligendi inventore molestias hic, dignissimos aliquid deserunt magnam distinctio incidunt? Iure in maiores temporibus totam! Lorem ipsum dolor sit amet consectetur adipisicing elit. Delectus dolorum quisquam quod voluptatem dolores esse assumenda quas asperiores qui rem rerum hic veniam similique accusamus, soluta sequi aut ipsam eum!  </p>
	</body>
</html>